/*div 元素选择器*/
/*div{*/
/*    background-color: rebeccapurple;*/
/*}*/
/* 伪类选择器*/
/*div:nth-child(odd) {*/
/*    background-color: rebeccapurple;*/
/*}*/

/*类选择器*/
/*.top, .foot 组合选择器*/
.top, .foot {
    /*background-color: rebeccapurple;*/
}

/* *  通配符
 一个参数 2个参数  3个参数  4个参数
margin 外边距
padding 内边距
border  边框
*/
* {
    margin: 0;
}

.content {
    /*flex容器*/
    display: flex;
    justify-content: center;
}

/*.content > div  子代选择器*/
.content > div {
    width: 1000px;
}


.top {
    background-image: url("../imgages/banner_qtah.jpg");
    width: 1000px;
    /*height: calc(1000px * 808 / 1980);*/
    height: 500px;
    background-size: 100% 100%;
    color: white;
}

.top > div {
    display: flex;
    justify-content: center;
}

.top > div > div {
    width: 800px;
    /*background: red;*/
    /*border: 1px solid red;*/
}

.top > div:nth-child(1) > div {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.top > div:nth-child(1) > div > div:nth-child(1) {
    width: 204px;
    height: 141px;
}

.top > div:nth-child(1) > div > div:nth-child(1) img {
    width: 100%;
    height: 100%;
}

/*右边手机图片和手机号码*/
.top > div:nth-child(1) > div > div:nth-child(2) {
    display: flex;
    align-items: center;
}

.top > div:nth-child(1) > div > div:nth-child(2) > div:nth-child(1) {
    margin: 5px;
}

/*-----------------------------导航--------------------*/
.top > div:nth-child(2) {
    background-color: rgb(230, 145, 55);
    height: 40px;
}

.top > div:nth-child(2) > div {
    display: flex;
    align-items: center;
}

.top > div:nth-child(2) > div > div {
    height: 40px;
    /*margin: 0 20px;*/
    line-height: 40px;
    padding: 0 20px;
}

.top > div:nth-child(2) > div > div:hover {
    background-color: white;
    color: rgb(230, 145, 55);
    cursor: pointer;
}

/*按照功能去命名*/
/*--------------------guanggao--------------------*/
.top > div:nth-child(3) {
    font-size: 10px;
}

.top > div:nth-child(3) > div > div:nth-child(1) {
    font-size: 30px;
    margin-top: 10px;
}

.top > div:nth-child(3) > div > div:nth-child(2) > div {
    /*margin: 5px 0;*/
    line-height: 25px;
}

/*     第三个   */
.top > div:nth-child(3) > div > div:nth-child(3) {
    font-size: 25px;
    color: rgb(230, 145, 55);
}

.top span:nth-child(odd) {
    font-size: 20px;
    color: white;
}

.top span:nth-child(3) {
    /*margin-left: 20px;*/
    margin-left: 1em;
}

.top > div:nth-child(3) > div > div:nth-child(3) > div:last-child {
    /*margin: 10px 0;*/
    /*margin-left: 2.5em;*/
    margin: 10px 0 0 2.5em;
}

/*-----------------公共的部分-------------*/
.title {
    font-size: 20px;
    color: rgb(230, 145, 55);
    margin: 10px;
}

.font-title {
    color: black;
    font-weight: bolder;
}

.font-area {
    color: gray;
}

.single-line-overflow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.many-line-overflow {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3; /* 自定义的行数 */

}
.middle {
    display: flex;
    justify-content: center;
}

.middle > div {
    width: 800px;
    margin: 50px;
}

/*-----------------公共的部分-------------*/